<template lang="pug">
div.static-simple-list
  div.static-simple-item(v-for="(item, index) in listData" :key="index")
    div.value.f-number
      CountTo(:startVal="0" :endVal="item.value")
    div.label {{ item.label }}
</template>

<script>
export default {
  name: "StaticSimpleList",
  props: {
    listData: {
      type: Array,
      default() {
        return [];
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.static-simple-list{
  display: flex;
  align-items: center;
  .static-simple-item{
    flex: 1;
    padding-right: rem(20);
    .value{
      @include fontSie(30);
      color: #FFFFFF;
      margin-bottom: rem(10);
      white-space: nowrap;
    }
    .label{
      color: $base_label_color;
      @include fontSie(16);
      white-space: nowrap;
    }
  }
}
</style>
